import React, { PropTypes } from 'react'
import { routerRedux } from 'dva/router'
import { connect } from 'dva'
import { Spin } from 'antd'
import ExGoodsSearch from '../components/exchange/ex-goods-search'
import ExGoodsList from '../components/exchange/ex-goods-list'
import ExGoodsModal from '../components/exchange/ex-goods-modal'

function ExChangeGoods({location,dispatch,app,exgoods}) {
	const {list,exchange,loading,pagination,modalVisible,modalType,fields,exusername,exphone,exchangeOrder,dataSource} = exgoods;
	const exGoodsModalProps = {
		dataSource: exchange,
		visible: modalVisible,
		fields: {
			username: {
				value: exusername
			},
			phone: {
				value: exphone
			}
		},
		onOk(param) {
			dispatch({
				type: `exgoods/${modalType}`,
				payload: param
			})
		},
		onCancel() {
			dispatch({
				type: 'exgoods/hideModal'
			})
		},

		onSubmit(params,userinfo){
			console.log(params)
			let orderNo = ''; // 编号
			let price = ''; // 价格
			let exreson = ''; // 原因
			let applyCount = ''; // 数量
			let code = ''; // 编号
			let name = ''; //名字
			let amount = '' //可换货数
			let str = '';
			for (var i in params) { 
				const reason = params[i].exreson ||'不填';
				const num = params[i].applyCount || 0;

				orderNo +=","+ params[i].orderNo;
				exreson += ","+  reason;

				applyCount += ","+ num;
				code += ","+ params[i].code;
				name += ","+ params[i].name;
				amount += ","+ params[i].amount;
				// str += params[i].orderNo + '|' + (params[i].exreson ||'不填') + '|' + (params[i].applyCount || '1') + '|' + params[i].code + '|' + params[i].name + '|' + params[i].amount 
 				
 			}
 			str = orderNo.substring(1) + '|' + exreson.substring(1)  + '|' +  applyCount.substring(1) + '|' + code.substring(1) + '|' + name.substring(1) + '|' +  amount.substring(1),
 			console.log(str);


			dispatch({
				type: 'exgoods/orderChange',
				payload: {
					data: str,
					name:userinfo.username.value,
					phone:userinfo.phone.value
				}				
			})
		}
	}

	const exGoodsListProps = {
		dataSource: list,
		loading,
		pagination: pagination,
		onEditItem(params){
			dispatch({
				type:'exgoods/Info',
				payload:{
					orderNo:params //进行换货的订单编号
				}
			})
		},

		onPageChange(page) {
			
			const { query, pathname } = location;
			dispatch(routerRedux.push({
				pathname: pathname,
				query: {
					...query,
					page: page.current,
					pageSize: page.pageSize
				}
			}))
			const keywords = document.getElementById('customer').value;
			dispatch({
				type: 'exgoods/query',
				payload: {
					keywords: keywords,
					page: page.current,
					pageSize: page.pageSize
				}
			})
		},
	}
	
	const exGoodsSearchProps= {
		onSearch(params){
   		dispatch({
				type: 'exgoods/search',
				payload: params
			})
		},
		onClear(){
			dispatch({
				type: 'exgoods/clear'
			})
		}
	}

	const StationModalGen = () =>
		<ExGoodsModal { ...exGoodsModalProps}/>;
	return( 
		<div className = 'content-inner' >
			<Spin tip = 'loading...' spinning = {loading} size = 'large' >
				<ExGoodsSearch {...exGoodsSearchProps}/> 
				<ExGoodsList {...exGoodsListProps}/>
				<StationModalGen />
			</Spin> 
		</div>
	)
}

ExChangeGoods.propTypes = {
	exgoods: PropTypes.object,
	location: PropTypes.object,
	dispatch: PropTypes.func
};

function mapStateToProps({app,exgoods}) {
	return {app,exgoods	}
}
export default connect(mapStateToProps)(ExChangeGoods)